<?php
   include($_SERVER['DOCUMENT_ROOT']."/eventos/sistema/common/login/seguranca.php"); // Inclui o arquivo com o sistema de segurança
	//protegePagina(); // Chama a função que protege a página
	error_reporting(0);



	$estados = "SELECT *
				FROM tbluf
				ORDER BY strSiglaUf
				LIMIT 0,30 ";
	$estados = mysql_query($estados) or die("Erro no SQL: ".mysql_error());
?>


<html xmlns="http://www.w3.org/1999/xhtml">

<link href="/eventos/css/participante/cadastro/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/eventos/js/participante/jquery-1.7.2.js"></script>
<script type="text/javascript" src="/eventos/js/participante/cadastro/interface.js"></script>
<script type="text/javascript"> var $j = jQuery.noConflict(); </script>
<script type="text/javascript" src="/eventos/js/participante/cadastro/sliding.form.js"></script>

<script language="javaScript">
	var strLocal = 'inserirParticipante';
</script>



<div id="content">
    <div id="wrapper">
        <div id="steps">
            <form id="formElem" name="formElem" action="/eventos/sistema/common/actCadastroParticipante.php?strOperacao=inserir" method="post">
                <fieldset class="step">
                    <legend class="legend">Login</legend>
                    <p class="pcenter">
                        <label for="username">Login</label>
                        <input id="strLogin" name="strLogin" />

                    </p>
                    <p class="pcenter">
                        <label for="email">Email</label>
                        <input id="email" name="email" placeholder="usuario@evento.com.br" type="email" AUTOCOMPLETE=OFF />
                        <label for="email">Confirme o email</label>
                        <input id="strEmail" name="strEmail" placeholder="usuario@evento.com.br" type="email" AUTOCOMPLETE=OFF />
                    </p>
                    <p class="pcenter">
                        <label for="Senha">Senha</label>
                        <input id="strSenha" name="strSenha" type="password" AUTOCOMPLETE=OFF />
                        <label for="senhaRepeat">Confirme a senha</label>
                        <input id="passwordRepeat" name="passwordRepeat" type="password" AUTOCOMPLETE=OFF />
                    </p>
                </fieldset>
                <fieldset class="step">
                    <legend class="legend">Dados Pessoais</legend>
                    <p class="pcenter">
                        <label for="name">Nome completo</label>
                        <input id="strNome" name="strNome" type="text" AUTOCOMPLETE=OFF />
                    </p>
                    <p class="pcenter">
                        <label for="rg">RG</label>
                        <input id="strRg" name="strRg" type="text" AUTOCOMPLETE=OFF />
                    </p>
                    <p class="pcenter">
                        <label for="cpf">CPF</label>
                        <input id="strCpf" name="strCpf" type="text" AUTOCOMPLETE=OFF />
                    </p>
                    <p class="pcenter">
                        <label for="telefone">Telefone</label>
                        <input id="strTelefone" name="strTelefone" placeholder="e.g. +351215555555" type="tel" AUTOCOMPLETE=OFF />
                    </p>
                    <p class="pcenter">
                        <label for="celular">Celular</label>
                        <input id="strCelular" name="strCelular" placeholder="e.g. +351215555555" type="tel" AUTOCOMPLETE=OFF />
                    </p>
                </fieldset>
                <fieldset class="step">
                    <legend class="legend">Informações</legend>
                    <p class="pcenter">
                        <label for="endereco">Data de nascimento</label>
                        <input id="dteNascimento" name="dteNascimento" type="date" AUTOCOMPLETE=OFF />
                    </p>
                    <p class="pcenter">

                        <label for="sexo">Sexo</label>
                        <select id="strSexo" name="strSexo">
                            <option value="F">Feminino</option>
                            <option value="M">Masculino</option>
                        </select>
                    </p>

                </fieldset>
                <fieldset class="step">
                    <legend class="legend">Endereço</legend>
                    <p class="pcenter">
                        <label for="estado">Estado</label>
                        <select name="strEstado" id="strEstado">
                                <option>Selecione...</option>
                                <?php
                                    while ($array_estados = mysql_fetch_array($estados)) {
										if ($array_estados[idUF] == $qryConsulta[idUF]) {
                                        	echo "<option value=" . $array_estados[idUF] . " selected = true >" . $array_estados[strSiglaUF] . "</option>" ;
										}
										else{
											echo "<option value=" . $array_estados[idUF] . ">" . $array_estados[strSiglaUF] . "</option>" ;
										}
									}
                                ?>
                        </select>
                    </p>
                    <p class="pcenter">
                        <label for="cidade">Cidade</label>
                        <select name="strCidade" id="strCidade">
							<option value="">-- Escolha um estado --</option>
						</select>
                        <script type="text/javascript">
								$j(function(){
									$j('#strEstado').change(function(){
										if( $j(this).val() ) {
											$j('#strCidade').hide();
											$j('.carregando').show();
											$j.getJSON('/eventos/js/common/cidades.ajax.php?search=',{StrEstado: $j(this).val(), ajax: 'true'}, function(j){
											var options = '<option value="">Selecione...</option>';
											for (var i = 0; i < j.length; i++) {
												options += '<option value="' + j[i].idCidade + '">' + j[i].strCidade + '</option>';
											}
											$j('#strCidade').html(options).show();
											$j('.carregando').hide();
										});
										} else {
											$j('#strCidade').html('<option value="">– Escolha um estado –</option>');
										}
									});
								});
							</script>


                    </p>
                    <p class="pcenter">
                        <label for="bairro">Bairro</label>
                        <input id="strBairro" name="strBairro" type="text" AUTOCOMPLETE=OFF />
                    </p>
                    <p class="pcenter">
                        <label for="endereco">Endereço</label>
                        <input id="strEndereco" name="strEndereco" type="text" AUTOCOMPLETE=OFF />
                    </p>
                    <p class="pcenter">
                        <label for="endereco">Cep</label>
                        <input id="strCep" name="strCep" type="text" AUTOCOMPLETE=OFF />
                    </p>
                </fieldset>
                <fieldset class="step">
                    <legend class="legend">Finalizar</legend>
                        <p>
                            Se todas as etapas têm uma marca de seleção verde, siguinifica
                            que o formulário foi preenchido corretamente. Um ícone vermelho
                            indica que algum campo está faltando ou foi preenchido com dados inválidos.
                        </p>
                        <p class="submit">
                            <button id="registerButton" type="submit">Registrar</button>
                        </p>
                </fieldset>
            </form>
        </div>
        <div id="navigation" style="display:none;">
            <ul>
                <li class="selected">
                    <a href="#">Login</a>
                </li>
                <li>
                    <a href="#">Dados Pessoais</a>
                </li>
                <li>
                    <a href="#">Informações</a>
                </li>
                <li>
                    <a href="#">Endereço</a>
                </li>
                <li>
                    <a href="#">Finalizar</a>
                </li>
            </ul>
        </div>
    </div>
</div>